﻿<?xml version="1.0" encoding="utf-8" ?>
<View
  xmlns="http://mobileui.codeplex.com/v1"
  xmlns:x="http://mobileui.codeplex.com/xaml"
  xmlns:Drawing="System.Drawing,System.Drawing"
  DesiredSize="Unbound">

  <View.MenuBar>
    <MenuBar>
      <MenuBar.MenuItems>
        <MenuBarItem Text="Back" Command="{Binding BackCommand}"/>
      </MenuBar.MenuItems>
    </MenuBar>
  </View.MenuBar>
  
  <View.Resources>
    <Drawing:SolidBrush x:Key="sliderBackground" Color="0,255,0"/>
    <Drawing:Pen x:Key="sliderStroke" Color="0,0,0" Width="1"/>
  </View.Resources>
  
  <GradientRectangleElement DesiredSize="Unbound" StartColor="240,240,240" EndColor="60,90,70"/>

  <TextElement DesiredSize="Unbound" Foreground="200,200,200" Text="Drag Demo" Angle="315" AutoSize="True" HorizontalAlignment="Center" VerticalAlignment="Center"/>

  <!--<DrawingPanel DesiredSize="Unbound" Background="{null}">
    <DrawingPanel.LayoutEngine>
      <StackLayout Margin="8,4" Padding="4"/>
    </DrawingPanel.LayoutEngine>

    <ButtonBar Text="Back" SecondaryText="Return to main menu" DesiredSize="UnboundAxis, 80" Background="{null}" Command="{Binding BackCommand}"/>

  </DrawingPanel>-->

  <DrawingPanel DesiredSize="Unbound" HorizontalAlignment="Center" VerticalAlignment="Center" Background="{null}">
    
    <RegularPolygonElement NumberOfSides="3" DesiredSize="80,80" Angle="90" Stroke="{StaticResource sliderStroke}" Background="{StaticResource sliderBackground}">
      <RegularPolygonElement.Behaviors>
        <DragBehavior DragAxis="Horizontal"/>
      </RegularPolygonElement.Behaviors>
    </RegularPolygonElement>
  
    <RegularPolygonElement NumberOfSides="3" DesiredSize="80,80" Angle="0" Stroke="{StaticResource sliderStroke}" Background="{StaticResource sliderBackground}">
      <RegularPolygonElement.Behaviors>
        <DragBehavior DragAxis="Vertical"/>
      </RegularPolygonElement.Behaviors>
    </RegularPolygonElement>

    <EllipseElement DesiredSize="60,60" HorizontalAlignment="Center" VerticalAlignment="Center" Stroke="{StaticResource sliderStroke}" Background="{StaticResource sliderBackground}">
      <RegularPolygonElement.Behaviors>
        <DragBehavior/>
      </RegularPolygonElement.Behaviors>
    </EllipseElement>

  </DrawingPanel>

</View>